<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div id="test">
			<com1 v-bind:parentmsg="msg"></com1>
		</div>
		<script>
			var vue = new Vue({
				el:'#test',
				data:{
					msg: "我是爸爸"
				},
				methods:{

				},
				components:{
					"com1": {
						template: `<h1 @click="change">父组件的信息：{{ parentmsg }}</h1>`,
						props: ["parentmsg"],
						methods: {
							change(){
								//this.parentmsg = '在子组件里面改变';
								this.$parent._data.msg = "在子组件里面改变";
								// $parent获取上层对象
								console.log(this.$parent._data.msg);
								console.log(this.parentmsg)
							}
						}
					}
				}
			})
		</script>
	</body>
</html>
